<template>
	<view class="list">
		<view class="item" v-for="(friend,index) in newFriens" :key='index' @click="goDetail(friend.uuid===uuid?friend.other:friend.uuid)">
			<image :src="friend.avat" mode=""></image>
			<view class="cont">
				<text>{{friend.userName}}</text>
				<text>{{friend.saySomething}}</text>
			</view>
			<text class="state" v-if="friend.uuid===uuid">{{friend.state|initiator}}</text>
			<text class="state" v-else>{{friend.state|inviter}}</text>
		</view>
	</view>
</template>

<script>
	import util from '../../utils/index.js'
	export default {
		data() {
			return {
				newFriens: [],uuid:''
			}
		},
		onLoad(option) {
			this.uuid=uni.getStorageSync('user').uuid
			util.myRequest({
				url: '/getNewFriends',
				data: {
					uuid: option.uuid
				}
			}).then(res => this.newFriens = res)

		},
		
		filters:{
			initiator(num){
				switch(num){
					case 0:
					return '已发送';
					case 1:
					return '已同意';
					case 2:
					return '已拒绝';
				}
			},
			inviter(num){
				switch(num){
					case 0:
					return '等待验证';
					case 1:
					return '已同意';
					case 2:
					return '已拒绝';
				}
			},
		},
		methods: {
goDetail(uuid){
	uni.navigateTo({
		url:'../userDetail/userDetail?uuid='+uuid
	})
}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #ededed;
	}

	.list {
		background-color: #fff;

		>.item {
			display: flex;
			height: 107upx;
			align-items: center;
			border-bottom: 1px solid #CCCCCC;
			padding-left: 30upx;
			position: relative;

			image {
				width: 72upx;
				height: 72upx;
				border-radius: 8upx;
			}

			.cont {
				display: flex;
				flex-direction: column;
				font-size: 30upx;
				margin-left: 20upx;

				text:nth-last-child(1) {
					font-size: 23upx;
					color: #999;
				}
			}

			.state {
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				right: 35upx;
				font-size: 21upx;
				color: #999;
			}

			&:nth-last-child(1) {
				border: none;
			}
		}
	}
</style>
